<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>登录-来设计工业设计在线</title>
		<link rel="stylesheet" type="text/css" href="../css/login.css" />
		<script type="text/javascript" src="../js/viewport.js"></script>
	</head>

	<body>
		<section class="main">
			<div class="logo"></div>
			<div class="main-form">
				<form action="" method="post">
					<!--登录方式 start-->
					<div class="login-type">
						<a class="type-btn active"><span>验证码登录</span></a>
						<a class="type-btn"><span>密码登录</span></a>
					</div>
					<!--登录方式 end-->
					<!--登录方式  视图 start-->
					<div class="login-content">
						<div class="view-code view-model">
							<input class="inputtext" type="number" id="" value="" placeholder="请输入手机号码" />
							<div class="input-code clearfix">
								<input class="inputtext" type="number" id="" value="" placeholder="请输入验证码" />
								<a class="send-codebtn">发送验证码</a>
							</div>
						</div>
						<div class="view-password view-model">
							<input class="inputtext" type="text" id="" value="" placeholder="请输入账号" />
							<input class="inputtext" type="password" id="" value="" placeholder="请输入密码" />
						</div>
					</div>
					<!--登录方式  视图 end-->
					<a class="loginbtn getbtn">登录</a>
					<a class="toget" href="register.html">没有账号？去注册</a>

					<input class="reset" type="reset" value="" />
				</form>
			</div>
		</section>
	</body>
	<script type="text/javascript" src="../js/jquery-1.12.4.min.js"></script>
	<script type="text/javascript" src="../js/common.js"></script>
	<script type="text/javascript" src="../js/login.js"></script>
	<script>
		//登录验证
		var $type_btn = $('.login-type .type-btn');
		$('.loginbtn').click(function() {
			//1.确定当前是  什么登录方式
			var index = null;
			for(var i = 0; i < $type_btn.length; i++) {
				if($type_btn.eq(i).hasClass('active')) {
					index = i;
					continue;
				}
			}

			//2.根据显示视图判断提交数据是否为空     index  :   0:验证码登录; 1: 密码登录
			var sel = null;
			if(index == 0) {
				sel = '.view-code';
			} else {
				sel = '.view-password';
			}

			var $input = $(sel + ' input');
			for(var i = 0; i < $input.length; i++) {
				if($input.eq(i).val() == '') {
					$input.eq(i).css('border-color', '#ee0003');
					return;
				}
			}

		});

		
		
//		$('input').on('focus',function(){
//			var _this = $(this);
//			timertt = setTimeout(function(){
//				var nowHeight = $('body').height();
//				$('body').animate({
//					scrollTop:(oldHeight-nowHeight)*0.5
//				},100);
//				$('.loginbtn').text(oldHeight+','+nowHeight);
//			},200);
//		});
		
		
		
		
	</script>

</html>